<template>
  <div>

    <div class="detail">
      <el-card class="box-card">
        <div slot="header" class="clearfix">
          <span>卡片名称</span>
          <el-button style="float: right; padding: 3px 0" type="text">操作按钮</el-button>
        </div>

        <!-- Tab 标签页 -->
        <el-tabs v-model="currentTab">

          <el-tab-pane label="登录账户设置" name="first">
            <!-- 登录账户设置 -->
            <login-setting>登录账户设置</login-setting>
          </el-tab-pane>

          <el-tab-pane label="个人详情" name="second">
            <!-- 个人详情 -->
            <user-detail>个人详情</user-detail>
          </el-tab-pane>

          <!-- 岗位信息 -->
          <el-tab-pane label="岗位信息" name="third">
            <job-info>岗位信息</job-info>
          </el-tab-pane>

        </el-tabs>
      </el-card>

    </div>
  </div>
</template>

<script>
import JobInfo from './components/jobInfo.vue'
import loginSetting from './components/loginSetting.vue'
import UserDetail from './components/userDetail.vue'
export default {
  components: { loginSetting, JobInfo, UserDetail },
  data() {
    return {
      // 设置默认的 Tab 标题
      currentTab: 'first'
    }
  },
  methods: {

  }
}
</script>

<style lang="scss" scoped>
.detail {
  margin: 15px;
}
</style>
